import React from 'react';
import ReactECharts from 'echarts-for-react';

class Charts extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      
    };
  }

  render() {
    const { chartOptions } = this.props;
    const defaultOptions = {
      title: {
        text: '应用排行'
      },
      grid: {
        right: '50px',
        bottom: '10px',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        name: '应用',
        data: [],
        axisTick: {
          alignWithLabel: true
        }
      },
      yAxis: {
        type: 'value',
        name: '使用次数'
      },
      series: []
    };
    // const appChartsOptions = Object.assign(defaultOptions, chartOptions);

    return (
      <ReactECharts
        notMerge
        option={Object.assign(defaultOptions, chartOptions)}
        style={{
          height: '100%',
          width: '100%'
        }}
        opts={{ renderer: 'svg' }} // 使用svg画图
      />
    );
  }
}

export default Charts;
